<template>
	<view class="viewCom">
		<navTitle :title="info.title || 'uni-app'"></navTitle>
		<scroll>
			<videoCom :qisim="qisim" :userInfo="userInfo" :adPlayer="adPlayer" :playState='playState'
				@setPlayState='setPlayState'>
			</videoCom>
			<options :info="info"></options>
			<info :info="info" v-if="info"></info>
			<qisimList v-if="info.url && info.url.length>1" :info='info' :qisimId="qisimId" :playState='playState'
				@handlePreplay="handlePreplay"></qisimList>
			<newList :list="info.munasiwetlik" :isShowDesc='false' title="مۇناسىۋەتلىك فىلىملەر"></newList>
			<view style="height:15px;"></view>
		</scroll>
	</view>
</template>

<script>
	import {
		getViewInfoData,
		getViewCommentListData,
		elanApi,
		getQisim,
		getUserSession,
	} from '@/api/view.js'
	import {
		getOptions
	} from '@/scripts/compatible/pageOptions.js'
	import {
		userInfoMixin
	} from '@/mixins/userInfo.js'
	import navTitle from '@/components/custom/navTitle.vue'
	import scroll from '@/components/custom/scroll.vue'
	import videoCom from '@/components/view/video.vue'
	import options from '@/components/view/options.vue'
	import info from '@/components/view/info.vue'
	import qisimList from '@/components/view/qisimList.vue'
	import newList from '@/components/custom/newList.vue'
	import {
		log
	} from 'util'

	export default {
		mixins: [userInfoMixin],
		props: {
			isOnShow: {
				type: Boolean,
				require: true,
			}
		},
		components: {
			navTitle,
			scroll,
			videoCom,
			options,
			info,
			qisimList,
			newList,
		},
		data() {
			return {
				info: {},
				qisim: {},
				adPlayer: {},
				qisimId: '',

				// 视频控件使用状态
				// 1.loading 加载视频资源
				// 2.play-ad 播放视频广告
				// 3.play-video 播放视频正片
				playState: 'loading',

				userInfo: {},
				commentList: [],
				commentListFlag: false,
			}
		},
		async mounted() {
			await this.userInfo_init()
			this.isOnShow_init()
		},
		methods: {
			isOnShow_init() {
				this.$watch('isOnShow', (isOnShow) => {
					if (isOnShow) {
						this.onShowEvent()
						this.$emit('setIsOnShow', false)
					}
				}, {
					immediate: true,
					deep: true
				})
			},
			setPlayState(playState) {
				this.playState = playState
			},
			async onShowEvent() {
				if (!this.adPlayer.ad_video) {
					await this.elanApi_init()
				}
				if (!this.qisimId) {
					await this.getInfoData()
				}
				if (!this.commentListFlag) {
					await this.getCommentListData()
				}
			},
			async elanApi_init() {
				const res = await elanApi()
				if (!res || (res && res.statusCode != 200)) {
					return
				}
				this.adPlayer = res.data.data.player
			},
			agent_init() {
				const options = getOptions()
				if (options.agent > 0) {
					let obj = JSON.parse(JSON.stringify(options))
					obj.utype = 'viewkino'
					uni.setStorageSync('agent', obj)
				}
			},
			async getInfoData() {
				const res = await getViewInfoData()
				if (!res || (res && res.statusCode != 200)) {
					return
				}
				this.info = res.data.data

				// 准备第一个视频资源
				const qisimId = this.info.url[0].id
				this.handlePreplay(qisimId)
			},
			handlePreplay(qisimId) {
				this.$emit('setLoading', true)
				this.setPlayState('loading')
				const qisim = this.info.url.find(o => o.id == qisimId)
				this.qisimShow(qisim, this.info.pirce)
				this.qisimId = qisimId
			},
			async qisimShow(urlObj, pirce) {
				const res = await getQisim(urlObj, pirce)
				// console.log(res);
				if (!res || (res && !res.data)) return
				if (res.data.code == 200) {
					this.qisim = res.data.data
					this.setPlayState('play-ad')
				} else if (res.data.code == 201) {

				}
				this.$emit('setLoading', false)
			},
			async getCommentListData() {
				const res = await getViewCommentListData()
				if (!res || (res && res.statusCode != 200)) {
					return
				}
				if (res.data.code == 200) {
					this.commentList = res.data.list
				} else if (res.data.code == 201) {

				}
				this.commentListFlag = true
			}
		},
	}
</script>

<style>
</style>